<template>
    <div class="app-container">
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
            <el-tab-pane label="销售概览">
                <div class="app-container" style="float: left">
                    <el-form ref="searchForm" :model="searchForm" style="width:400px">
                        <el-form-item>
                            <el-input v-model="searchForm.goodsName"  placeholder="商品名/流水号" size="mini" style="width:60%;padding-right: 10px;"></el-input>
                            <el-button size="mini"  type="primary"  @click="saleHandleDataSelect()">查询</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                <div class="app-container" style="float: right">
                    <el-button size="mini"  type="primary" @click="salesHandleAdd()">新增</el-button>
                    <!--<el-button size="mini"  type="primary"  @click="perHandleDataSelect()">禁用</el-button>
                    <el-button size="mini"  type="primary"  @click="perHandleDataSelect()">启用</el-button>-->
                    <el-button size="mini"  type="primary"  @click="goodsInfoDownLoad()">下载</el-button>
                </div>
                <div>
                    <el-table :data="sealsFormData" style="width: 100%;" border="true"
                              stripe="true" show-summary="true" sum-text="合计"
                    >
                        <el-table-column type="selection" width="55" />
                        <el-table-column prop="sourceId" align="center" label="流水号"/>
                        <el-table-column prop="goodName" align="center" label="商品名称"/>
                        <el-table-column prop="salePrice" align="center" label="售价(元)">
                            <template #default="scope">
                                {{scope.row.salePrice.toFixed(2) }}
                            </template>
                        </el-table-column>
                        <el-table-column prop="saleNums"  :precision="2" align="center" label="出售量(件)"/>
                        <el-table-column prop="allProfitPrice" align="center" label="总净利润(元)">
                            <template #default="scope">
                                {{scope.row.allProfitPrice.toFixed(2) }}
                            </template>
                        </el-table-column>
                        <el-table-column prop="buyerName" align="center" label="购买者"/>
                        <el-table-column prop="createTime" align="center" label="购买时间"/>
                        <el-table-column fixed="right" align="center" label="操作" width="250">
                            <template #default="scope">
                                <el-button size="mini" @click="saleHandleDetail(scope.row)" type="info">详情</el-button>
                                <el-button size="mini" @click="handleEdit(scope.row)" type="primary">
                                    编辑
                                </el-button>
                               <!-- <el-popconfirm title="确定删除吗"
                                               confirmButtonText="确定"
                                               cancelButtonText="取消"
                                               :icon="InfoFilled"
                                               icon-color="red"
                                               @confirm="handleDel(scope.row)">
                                    <template #reference>
                                        <el-button size="mini" type="danger">删除</el-button>
                                    </template>
                                </el-popconfirm>-->
                                <el-button size="mini" @click="printTicket(scope.row)" type="primary">打印</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <!--分页-->
                <div style="margin-left: 20px">

                    <el-pagination
                            v-model:currentPage="currentPage"
                            :page-size="currentSize"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="total"
                            @size-change="SaleSizeChange"
                            @current-change="SaleCurrentChange">
                    </el-pagination>

                </div>


            </el-tab-pane>
            <el-tab-pane label="盈亏概览">
            </el-tab-pane>
        </el-tabs>

    </div>
</template>
<script>
    import request from "../../utils/request";
    import {ElMessage} from "element-plus";

    export default {
        name: "Data",
        data(){
            return{
                sealsFormData:[],
                searchForm:{"goodsName":""},
                currentPage:1,
                currentSize:5,
                total:0
            }
        },
        created(){
            this.handleSaleFormDataList();
        },
        methods:{
            saleHandleDetail(row) {
                this.$router.push({
                    path: '/SalesAdd',
                    query: {
                        id: row.id,
                        type: 'detail'
                    }
                });
            },

            saleHandleDataSelect(){
                this.handleSaleFormDataList();
            },
            salesHandleAdd(){
                this.$router.push('/SalesAdd');
            },
            handleSaleFormDataList(){
                request.get("/api/sale/getSaleInfoPage",{
                    params:{
                        currentPage:this.currentPage,
                        currentSize:this.currentSize,
                        searchContent:this.searchForm.goodsName
                    }
                }).then(resp=>{
                    if(resp.status =='M0200'){
                        this.sealsFormData=resp.data.list;
                        this.total = resp.data.total;
                    }else{
                        ElMessage({
                            message:"添加失败:",
                            type:"error"
                        })
                    }
                })
            },
            SaleCurrentChange(v){
                this.currentPage=v
                this.handleSaleFormDataList()
            },
            SaleSizeChange(v){
                this.currentSize=v
                this.handleSaleFormDataList()
            },
        },

    }
</script>

<style scoped>

</style>
